@keyframes iconlib-appear
  from
    opacity 0
  to
    opacity 1

.p-iconlib
  user-select none
  overflow hidden
  background var(--color-background)
  animation iconlib-appear 0.6s ease
  @media (min-width: $app_mobile_width_min)
    margin $gap * 4 0
    border-radius $gap * 0.5
    border 1px solid var(--color-clear)

.p-iconlib-caption
  padding 0 $gap
  font-size 0.8em
  line-height 2.5
  background var(--color-clear)
  i
    margin-right $gap * 0.5

.p-iconlib-readme
  @media (min-width: $app_mobile_width_min)
    padding $gap * 6 ($gap * 4)
  @media (max-width: $app_mobile_width)
    padding $gap * 5 ($gap)
  h1:first-of-type, h1:nth-of-type(2)
    text-align center
    padding-bottom 0.5em
    @media (min-width: $app_mobile_width_min)
      margin-bottom $gap * 6
    @media (max-width: $app_mobile_width)
      margin-bottom $gap * 5
  .md
    user-select text
    overflow hidden
    @media (min-width: $app_mobile_width_min)
      max-height s('calc(100vh - %s - 3em - %s)', $progress_height, $gap * 24 + $font_size * 2)
      padding 0 $gap * 2
    @media (max-width: $app_mobile_width)
      max-height s('calc(100vh - %s - 3em - %s)', $progress_height, $gap * 10 + $font_size * 4)
      padding 0 $gap
    position relative
    &:after
      content ''
      position absolute
      bottom 0
      left 0
      height 1em
      width 100%
      background linear-gradient(180deg, #ffffff00 0, var(--color-recentposts-more-front))
  &.active
    .md
      max-height none
      &:after
        visibility hidden
    .p-iconlib-more
      background var(--color-link)
      margin-top 2em
      border-radius 1.25em
    .iconlib-more
      display none
    .iconlib-less
      display inline

.p-iconlib-more
  font-size 0.85em
  line-height 2.5
  text-align center
  cursor pointer
  width 100%
  background var(--color-recentposts-more-front)
  color var(--color-recentposts-more-back)
  border-radius 0 0 1.25em 1.25em

.iconlib-less
  display none

.p-iconlib-iframe
  width 100%
  display block
  height 14em
  //background var(--color-iconlib-iframe-back)

@media (max-width: $app_mobile_width)
  .p-iconlib-caption
    text-align center
    i
      display none